<%@ page language="java" contentType="text/html;charset=UTF-8" pageEncoding="UTF-8"%>
<%@ page import="java.util.*"%>

<%
    String path = request.getContextPath();
    String ctx = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path;
    String wctx = request.getServerName()+":"+request.getServerPort()+path;
    String scheme=request.getScheme();
%>
<html>
<head>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>丰县应急管理综合应用平台-协同会商系统</title>
    <script type="text/javascript" src="<%=ctx%>/websocket/jquery-1.12.3.min.js" ></script>
    <script type="text/javascript" src="<%=ctx%>/websocket/bootstrap.min.js" ></script>
    <link rel="stylesheet" href="<%=ctx%>/websocket/bootstrap.min.css" />
    <style>
        *{
            margin: 0;
            padding: 0;
        }
        body {
            width: 100%;
            height: 100%;
            overflow: hidden;
            background-color: #FFFFFF;
            font-family: "Microsoft YaHei", sans-serif;
        }

        .pageContainer {
            bottom: 0;
            left: 0;
            right: 0;
            top: 50px;
            position: absolute;
            width: 100%;
            height: 100%;
        }

        .pageSidebar {
            text-align: center;
            width: 100px;
            height: 100%;
            background-color: #102146;
            position: relative;
            top: 0;
            left: 0
        }

        .pageContent {
            display: block;
            height: 100%;
            margin-left: 100px;
            margin-right: 0;
            margin-top: 0;
            padding: 0;
            border: 1px solid red;
            background: #1B6D85;
        }

        .nav>li {
            text-align: center;
        }

        .nav>li>a {
            color: #aaddff;
            padding: 16px 15px;
        }

        .nav>li>a:focus,
        .nav>li>a:hover {
            background-color: rgba(17,82,133,.6)!important;
            border-left: 3px solid #00a0e9;
            color: #fff;
        }

        .pageSidebar .nav li a:hover {
            background-color: #5e6c8a;
        }

        .dropdown-menu>li>a {
            padding: 10px 15px;
        }

        .container-fluid {
            background: #102146;
        !important;
        }

        .navbar {
            border: 0;
            margin-bottom: 0;
        }
        .lan,.bai{
            display: block;
            margin: 0 auto;
        }
        .a_boder{ display:block; float:right; width:70px; height:54px; color:#ffffff; position:relative;color: #FFFFFF;}
        .left_a_boder span{ position:absolute; top:65px; left:12px;}
        .back_l{background:url(<%=ctx%>/websocket/image/tc.png) no-repeat;background-size:75px 60px;}
        .back_l:hover{background:url(<%=ctx%>/websocket/image/tc_hover.png) no-repeat;color:#fff;background-size:75px 60px;}
    </style>
    <script>
        function logoutFun() {
            top.location.href="<%=ctx%>/logout";
        }
    </script>
</head>
<body>
<table border="0" style="width: 100%;height: 100%">
    <tr style="height: 60px">
        <td colspan="2">
            <div style="height: 100%;width: 100%;background: #102146;border-bottom:2px solid #000000;">
                <div style="background-image:url(<%=ctx%>/websocket/image/dit.png);height: 54px;margin-left:20px;width:568px;background-repeat:no-repeat;float:left">
                </div>
                <div style="height: 54px;color: #FFFFFF;float:right;margin-right:0px;display:table-cell; vertical-align:middle;">
                    <a onclick="logoutFun();" class="a_boder back_l"></a>
                </div>
                <div style="height: 54px;line-height: 54px;color: #FFFFFF;float:right;margin-right:10px;display:table-cell; vertical-align:middle;text-align: center;">
                    <span><img src="<%=ctx%>/websocket/image/touxiang.png" width="32">${sessionScope.username}</span>
                </div>
            </div>
        </td>
    </tr>
    <tr>
        <td style="width:53px">
            <!-- 左侧导航栏 -->
            <div class="pageSidebar">
                <ul class="nav nav-stacked">
                    <li role="presentation">
                        <a href="<%=ctx%>/gismeet" target="mainFrame">
                            <img src="<%=ctx%>/websocket/image/sy.png" alt="" class="lan"/>
                            <img src="<%=ctx%>/websocket/image/sy_hover.png" alt="" class="bai" style="display: none;"/>
                            协同标绘</a>
                    </li>
                    <li role="presentation">
                        <a href="<%=ctx%>/textmeet" target="mainFrame">
                            <img src="<%=ctx%>/websocket/image/wz.png" alt="" class="lan"/>
                            <img src="<%=ctx%>/websocket/image/wz_hover.png" alt="" class="bai" style="display: none;"/>
                            文字会商</a>
                    </li>
                    <li role="presentation">
                        <a href="<%=ctx%>/videomeet" target="mainFrame">
                            <img src="<%=ctx%>/websocket/image/sp.png" alt="" class="lan"/>
                            <img src="<%=ctx%>/websocket/image/sp_hover.png" alt="" class="bai" style="display: none;"/>
                            视频会商</a>
                    </li>
                    <%--<li role="presentation">
                        <a href="<%=ctx%>/gislocal" target="mainFrame">
                            <img src="<%=ctx%>/websocket/image/bh.png" alt="" class="lan"/>
                            <img src="<%=ctx%>/websocket/image/bh_hover.png" alt="" class="bai" style="display: none;"/>
                            标绘工具</a>
                    </li>
                    <li role="presentation">
                        <a href="<%=ctx%>/file/sharefiles" target="mainFrame">
                            <img src="<%=ctx%>/websocket/image/wj.png" alt="" class="lan"/>
                            <img src="<%=ctx%>/websocket/image/wj_hover.png" alt="" class="bai" style="display: none;"/>
                            文件共享</a>
                    </li>
                    <li role="presentation">
                        <a href="<%=ctx%>/remotemonitor" target="mainFrame">
                            <img src="<%=ctx%>/websocket/image/tp.png" alt="" class="lan"/>
                            <img src="<%=ctx%>/websocket/image/tp_hover.png" alt="" class="bai" style="display: none;"/>
                            现场图像</a>
                    </li>--%>
                </ul>
            </div>
        </td>
        <td>
            <iframe src="<%=ctx%>/gismeet" id="mainFrame" name="mainFrame" frameborder="0" width="100%" height="100%" frameBorder="0"></iframe>
        </td>
    </tr>
</table>
<script type="text/javascript">
    $(".nav li").click(function() {
        indd = $(".nav li").index(this);
        $(this).find(".lan").hide();
        $(this).find(".bai").show()
        $(".nav li").eq(indd).siblings().find(".lan").show();
        $(".nav li").eq(indd).siblings().find(".bai").hide();
    });
</script>
</body>
</html>
